@charset "utf-8";
@import "common/common";
.carousel{
//  .left{
//      line-height: 278px;
//  }
//  .right{
//      line-height: 278px;
//  }
}
.blade{
    padding-top: 33px;
    position: relative;
//  background: url(../images/game_bg_02.png) no-repeat left bottom;
    .remen{
        width: 40px;
        height: 100px;
        float: left;
        text-align: center;
        border-bottom: 13px solid transparent;
        border-left: 20px solid #e14738;
        border-right: 20px solid #e14738;
        position: absolute;
        top: 0;
        p{
            font-size: 19px;
            color: #fff;
            background: #e14738;
            display: block;
            position: absolute;
            top: 25px;
            left: -9px;
        }
    }
    .blade_show{
        padding: 0;
        img{
            width: 100%;
        }
    }
    .blade_all{
        float: right;
        text-align: right;
        padding: 0;
        .blade_title{
            padding: 0;
            h2{
                font-size: 29px;
            }
            p{
                font-size: 12px;
                color: #898989;
                line-height: 31px;
            }
        }
        .blade_pic{
            .blade_img{
                border-radius: 5px;
                overflow: hidden;
                padding: 0;
                margin-bottom: 30px;
                img{
                    width: 100%;
                }
                &:nth-child(2n){
                    margin-right: 0;
                }

                    img{
                    width: 100%;
                }
            }
        }
    }
}


.go_wrap{
    padding-top: 63px;
    .go_all{
        padding: 0;
        .go_title{
            padding: 0;
            h2{
                font-size: 27px;
            }
            p{
                 font-size: 12px;
                color: #898989;
                line-height: 31px;
            }
        }
        .go_pic{
            padding: 0;
            .go_img{
                border-radius: 5px;
                overflow: hidden;
                padding: 0;
                margin-bottom: 30px;
                img{
                    width: 100%;
                }
                &:nth-child(2n){
                    margin-right: 0;
                }

                    img{
                    width: 100%;
                }
            }
        }
    }
    .go_show{
        img{
            width: 100%;
        }
    }
}


.examples_wrap{
    padding-top: 103px;
    padding-bottom: 92px;
    .examples_title{
        h2{
            font-size: 34px;
        }
    }
    .examples_all{
        .examples_item{
            text-align: center;
            padding: 0;
            overflow: hidden;
            position: relative;
            &:nth-child(3n){
                margin-right: 0;
            }
            .item_pic{
                overflow: hidden;
                border-radius: 3px;
                padding: 0;
                margin-bottom: 13px;
                margin-right: 0;
                img{
                    width: 100%;
                }
                &:hover {
                    .examples_cont{
                      transform: translateX(0);
                    }
                        
                }
            }
            p{
                font-size: 13px;
            }
            .examples_cont{
                width: 100%;
                height: 100%;
                background: rgba(0,0,0,.55);
                padding: 14px;
                position: absolute;
                top: 0;
                transform: translateX(-100%);
                transition: all 1.5s linear;
                p{
                    font-size: 13px;
                    color: #fff;
                }
            }
        }
    }
}

@media (max-width:768px){
.examples_wrap{
    .examples_all{
        .examples_item{
            .examples_cont{
                p{
                         overflow: hidden;
                         text-overflow: ellipsis;
                         display: -webkit-box;
                         -webkit-line-clamp: 4;
                         -webkit-box-orient: vertical;
                }
                
            }
        }
    }
}
}

@media (min-width:768px) and (max-width:992px) {
    .nav {
        >li {
            >a {
                padding-left: 5px;
                padding-right: 5px;
            }
        }
    }
    .examples_wrap{
    .examples_all{
        .examples_item{
        }
    }
}
}

@media (min-width:992px) {
    .container {
        width: 970px;
        padding-left: 14px;
    }
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 0;
    }
}